<template>
    <div>
        <div @click="clickDeleteNullData" class="vue-flow-model">
            <n-icon size="30" color="#18A058">
                <container-registry/>
            </n-icon>
            <Handle id="deleteNullData-inlet" type="target" :position="Position.Left" :is-valid-connection="props.isValidSourcePos"/>
            <Handle id="deleteNullData-export" type="source" :position="Position.Right" :is-valid-connection="props.isValidTargetPos"/>
        </div>
        <span>去除空值</span>
        <n-drawer v-model:show="active" :width="'80vw'">
            <n-drawer-content>
                <template #header>
                    去除空值
                </template>
                <!--获取上级节点数据 进行去除空值-->
                <n-space>
                    <n-button @click="getSuperiorData">
                        <template #icon>
                            <n-icon><Login/></n-icon>
                        </template>
                        获取上级节点数据
                    </n-button>
                    <n-button @click="deleteNullData">
                        <template #icon>
                            <n-icon><container-registry/></n-icon>
                        </template>
                        去除空值
                    </n-button>
                </n-space>
                <!--展示数据-->
<!--                <n-data-table :columns="props.data.data.title" :data="props.data.data.data" :pagination="pagination"/>-->
                <template #footer>
                    <n-button @click="active=false">完成</n-button>
                </template>
            </n-drawer-content>
        </n-drawer>
    </div>
</template>

<script setup>

import {Handle, Position} from "@vue-flow/core";
import {ContainerRegistry ,Login} from "@vicons/carbon";
import {useElementsStore} from "@/stores/elements";
import workApi from "@/http/workApi";
const props = defineProps(['isValidTargetPos', 'isValidSourcePos','id','data'])
const elements = useElementsStore()

const clickDeleteNullData = ()=>{
    active.value = true
}
// 抽屉
const active = ref(false)

const getSuperiorData = ()=>{
    // 获取上级节点数据
    for (let i of elements.elements) {
        if (i['target']===props.id) {
            for (let j of elements.elements) {
                if (j.id === i['source']) {
                    props.data.data = {...j.data.data}
                    props.data.data.title.map(s=>{
                        // 移除可修改
                        delete s.render
                        return s
                    })
                    return
                }
            }
        }
    }
}
const deleteNullData = ()=>{
    // 发送数据到后台去除空值
    workApi.post("perform_tasks/delete_null",{
        data:props.data.data
    }).then(s=>{
        props.data.data = s.data
    })
}
// 单页数据量
const pagination = {
    pageSize: 15
}
</script>

<style scoped lang="less">

</style>